<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

     
      <HTML>
      <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <link rel="stylesheet" type="text/css" href="jsp/style.css" />
      <script TYPE="text/javascript">
      function emailcheck(str) {

    	  var at="@";
    	  var dot=".";
    	  var lat=str.indexOf(at);
    	  var lstr=str.length;
    	  var ldot=str.indexOf(dot);
    	  if (str.indexOf(at)==-1){
    	  alert("Invalid E-mail ID");
    	  return false;
    	  }

    	  if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
    	  alert("Invalid E-mail ID");
    	  return false;
    	  }

    	  if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
    	  alert("Invalid E-mail ID");
    	  return false;
    	  }

    	  if (str.indexOf(at,(lat+1))!=-1){
    	  alert("Invalid E-mail ID");
    	  return false;
    	  }

    	  if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
    	  alert("Invalid E-mail ID");
    	  return false;
    	  }

    	  if (str.indexOf(dot,(lat+2))==-1){
    	  alert("Invalid E-mail ID");
    	  return false;
    	  }

    	  if (str.indexOf(" ")!=-1){
    	  alert("Invalid E-mail ID");
    	  return false;
    	  }
    	 
    	  return true;
    	  }

    	 
     
      function validate(){
     
      if(document.frm.firstname.value=="")
      {
   alert("Please enter first name");
   document.frm.firstname.focus();
   return false;
      }
      if(document.frm.lastname.value=="")
      {
   alert("Please enter last name");
   document.frm.lastname.focus();
   return false;
      }
      if(document.frm.username.value=="")
      {
   alert("Please enter username");
   document.frm.username.focus();
   return false;
      }
      if(document.frm.password.value=="")
      {
   alert("Please enter password");
   document.frm.password.focus();
   return false;
      }
     
      if(document.frm.email.value=="")
      {
   alert("Please enter email");
   document.frm.email.focus();
   return false;
      }
      
      var emailID=document.frm.email;

	  if ((emailID.value==null)||(emailID.value=="")){
	  alert("Please Enter your Email Address");
	  emailID.focus();
	  return false;
	  }
	  
	  if (emailcheck(emailID.value)==false){
	  emailID.value="";
	  emailID.focus();
	  return false;
	  }
	 
      if(document.frm.state.value=="")
     {
   alert("Please enter state");
   document.frm.state.focus();
   return false;
      }
      if(document.frm.city.value=="")
      {
   alert("Please enter city");
   document.frm.city.focus();
   return false;
      }
      if(document.frm.zipcode.value=="")
      {
   alert("Please enter zipcode");
   document.frm.country.focus();
   return false;
      }
      return true;
      
   

      
      }
      </script>
      </head>
      <BODY >
    <div id="container">
		<div id="header">
		<img src="../../images/video-library-logo-2.jpg" height="80px" width="250px" alt="" />
        	<h1><span class="off"> </span></h1>
             </div>   
        
        <div id="menu">
        	<ul>
            	<li class="menuitem"><a href="LoginServlet">Home</a></li>
               
            
                <li class="menuitem"><a href="addform.jsp">Sign Up</a></li>
                <li class="menuitem"><a href="Login.jsp">Log In</a></li>
              
              <li class="menuitem"><a href="ContactUs.jsp">Contact Us</a></li>
              
            </ul>
        </div>
        
        <div id="leftmenu">

        <div id="leftmenu_top"></div>

				<div id="leftmenu_main">    
                
                <h3>Links</h3>
                        
                <ul>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                </ul>
</div>
                
                
              <div id="leftmenu_bottom"></div>
        </div>
        
        
        
        
		<div id="content">
       
             
        
        <div id="content_top"></div>
        <div id="content_main">
        
        <FORM NAME="frm" METHOD="post" action="SignUp" onsubmit="return validate();" >
      

   <H1 align="center">  Sign Up </H1> 
      <BR>
      <TABLE  ALIGN="CENTER" width="400px">
      
      <TR>
      <TD> <b>First Name</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="firstname" id="firstname" value="">
       </TD>
      </TR>
      <TR>
      <TD><b>Last Name</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="lastname" id="lastname" value="">
      </TD>
      </TR>
      <TR>
      <TD><b>Username</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="username" id="username" value="" >
       </TD>
      </TR>
      <TR>
      <TR>
      <TD><b>Password</b></TD>
      <TD><INPUT TYPE="password" NAME="password" id="password" value="" >
       </TD>
      </TR>
      <TR>
      <TR>
      <TD><b>Email</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="email" id="email" value="" >
       </TD>
      </TR>
       <TR>
      <TD><b>Address</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="address" id="address" value="">
       </TD>
      </TR>
      
     <TR>
      <TD> <b>City</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="city" id="city" value="">
       </TD>
      </TR>
       <TR>
      <TD><b>State</b></TD>
      <TD><select name="state" size="1">
	<option value="AL">Alabama</option>
	<option value="AK">Alaska</option>
	<option value="AZ">Arizona</option>
	<option value="AR">Arkansas</option>
	<option value="CA">California</option>
	<option value="CO">Colorado</option>
	<option value="CT">Connecticut</option>
	<option value="DE">Delaware</option>
	<option value="DC">Dist of Columbia</option>
	<option value="FL">Florida</option>
	<option value="GA">Georgia</option>
	<option value="HI">Hawaii</option>
	<option value="ID">Idaho</option>
	<option value="IL">Illinois</option>
	<option value="IN">Indiana</option>
	<option value="IA">Iowa</option>
	<option value="KS">Kansas</option>
	<option value="KY">Kentucky</option>
	<option value="LA">Louisiana</option>
	<option value="ME">Maine</option>
	<option value="MD">Maryland</option>
	<option value="MA">Massachusetts</option>
	<option value="MI">Michigan</option>
	<option value="MN">Minnesota</option>
	<option value="MS">Mississippi</option>
	<option value="MO">Missouri</option>
	<option value="MT">Montana</option>
	<option value="NE">Nebraska</option>
	<option value="NV">Nevada</option>
	<option value="NH">New Hampshire</option>
	<option value="NJ">New Jersey</option>
	<option value="NM">New Mexico</option>
	<option value="NY">New York</option>
	<option value="NC">North Carolina</option>
	<option value="ND">North Dakota</option>
	<option value="OH">Ohio</option>
	<option value="OK">Oklahoma</option>
	<option value="OR">Oregon</option>
	<option value="PA">Pennsylvania</option>
	<option value="RI">Rhode Island</option>
	<option value="SC">South Carolina</option>
	<option value="SD">South Dakota</option>
	<option value="TN">Tennessee</option>
	<option value="TX">Texas</option>
	<option value="UT">Utah</option>
	<option value="VT">Vermont</option>
	<option value="VA">Virginia</option>
	<option value="WA">Washington</option>
	<option value="WV">West Virginia</option>
	<option value="WI">Wisconsin</option>
	<option value="WY">Wyoming</option>
</select>
       </TD>
      </TR>
     
       <TR>
      <TD> <b>Zipcode</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="zipcode" id="zipcode" value="">
    </TD>
      </TR>
       <TR>
      <TD> <b>Member type</b></TD>
      <TD> <INPUT TYPE="radio" NAME="Membertype" id="memtype" value="SimpleCustomer" CHECKED>
             Simple Customer
            <BR>
            <INPUT TYPE="radio" NAME="Membertype" id="memtype" value="PremiumCustomer">
            Premium Member
            <BR>
            
      
     </TD>
      </TR>
       <TR>
      <TD> <b>Creditcard Number</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="creditcardno" id="credit_no" value="">
      </TD>
      </TR>
       <TR>
      <TD> <b>Creditcard type</b></TD>
      <TD><SELECT id="creditcard_type" name="creditcard_type">
      <option value="Visa">Visa<option>
      <option value="Mastercard">Mastercard<option>
      <option value="American Express">American Express<option>
      </SELECT>


       </TD>
      </TR>
       <TR>
      <TD> <b>CVV no</b></TD>
      <TD><INPUT TYPE="TEXT" NAME="Cvvnumber" id="cvv" value="">
      </TD>
      </TR>
      
    
     <TR> 
      <TD colspan=3 align="center"> <INPUT TYPE= "Submit" NAME="submit" VALUE="Sign Up">
 </TD>
      </TR>
      </TABLE>
      </FORM>
      
      </div>
        <div id="content_bottom"></div>
            
            </div>
      </BODY>
      </HTML>
   